<template>
    <div class="row-box">
        <el-table :data="data">
            <el-table-column prop="name" label="名称">
                <template slot-scope="scope">
                    <div style="display: flex;align-items: center;">
                        <div class="row-img">
                            <el-image v-if="scope.row.type == 'dir'" style="width: 100%;height: 100%;" :src="folderImg"></el-image>
                            <el-image v-if="scope.row.type == 'doc'" style="width: 100%;height: 100%;" :src="fileImg"></el-image>
                        </div>
                        <span @click="documentClick(scope.row)" class="document-title">{{scope.row.name}}</span>
                    </div>
                </template>
            </el-table-column>
            <el-table-column prop="updateTime" label="更新时间" width="220">
            </el-table-column>
            <el-table-column prop="createBy" label="创建者" width="130">
            </el-table-column>
            <el-table-column label="类型" width="130">
                <template slot-scope="scope">
                    <span>{{scope.row.type | dirType}}</span>
                </template>
            </el-table-column>
            <el-table-column prop="creator" fixed="right" label="操作" width="60">
                <template slot-scope="scope">
                    <folderPopover v-if="listQuery.isUpdate != 1 && scope.row.type == 'doc'" :functionIndex="functionIndex" :listQuery="listQuery" :treeData="scope.row" :documentType="documentType"></folderPopover>
                    <span v-if="listQuery.isUpdate == 1 || scope.row.type == 'dir'">-</span>
                </template>
            </el-table-column>
        </el-table>
    </div>

</template>

<script>
import folderPopover from "./folderPopover.vue";
export default {
    data() {
        return {
            folderImg:require("../../../../img/8eacfb1a6bafde0a172c6b393950dab8.svg"),
            fileImg:require("../../../../img/140a48decfb0a656a23a22e2cbb6bee8.svg"),
            filePdfImg:require("../../../../img/1a69b207d1bac0dc2f5ae970b86580c2.svg"),
        };
    },
    components: {
        folderPopover,
    },
    props: ["data", "listQuery", "functionIndex", "documentType"],
    filters: {
        docType(data) {
            if (data == "00") {
                return "项目附件";
            } else if (data == "01") {
                return "任务附件";
            } else if (data == "02") {
                return "产品文档";
            } else if (data == "04") {
                return "企业文档";
            } else if (data == "05") {
                return "合同文档";
            } else if (data == "06") {
                return "知识库";
            }
        },
        dirType(data) {
            if (data == "dir") {
                return "文件夹";
            } else if (data == "doc") {
                return "文件";
            }
        },
    },
    methods: {
        documentClick(item) {
            if (item.type == "dir") {
                this.$emit("dirClick", item);
                // window.open(item.filePath, '_system') //url为访问的地址
            } else {
                //   window.open('https://view.officeapps.live.com/op/view.aspx?src=' + item.filePath)
                var _this = this;
                console.log(item);
                if (item.docType == "05") {
                    var data = {
                        docType: item.docType,
                        dirId: item.dirId,
                        docId: item.docId,
                    };
                    this.$router.push({
                        path: "/contract/details",
                        query: { data: JSON.stringify(data) },
                    });
                } else if (item.docType == "04") {
                    var data = {
                        docType: item.docType,
                        dirId: item.dirId,
                        docId: item.docId,
                    };
                    this.$router.push({
                        path: "/document/details",
                        query: { data: JSON.stringify(data) },
                    });
                }else{
                //   window.open('https://view.officeapps.live.com/op/view.aspx?src=' + item.docFilePath[0].fileUrl)
                    //  window.open(item.docFilePath[0].fileUrl, "_blank");
                }
            }
        },

        // 	documentClick(item){
        // 		var _this = this
        // if(item.type == 'dir'){
        //   this.$emit('dirClick',item)
        //   // window.open(item.filePath, '_system') //url为访问的地址
        // }else{
        //   window.open('https://view.officeapps.live.com/op/view.aspx?src=' + item.filePath)
        // }
        // 	}
    },
};
</script>

<style scoped>
.row-box {
    width: 100%;
    background-color: firebrick;
    position: relative;
}
.row-img {
    width: 20px;
    height: 20px;
    margin-right: 10px;
}
/deep/.el-table__fixed-right::before {
    z-index: 3 !important;
}

.document-title {
    cursor: pointer;
}

.document-title:hover {
    color: #2c7ef8;
}
</style>
